<template>
	<view class="pay-success" v-if="!loading">
		<cu-custom bgColor="" :isBack="true" :class="'bg-' + themeColor.name">
			<block slot="content">支付成功</block>
		</cu-custom>
		<view class="pay-section" :class="'bg-' + themeColor.name">
			<image class="bg" :src="moneyBg"></image>
			<view class="tips-wrapper">
				<text class="iconfont iconxuanzhong2"></text>
				<view class="content">
					<text class="title">支付成功！</text>
					<view class="tip">感谢您的购买</view>
				</view>
			</view>
		</view>
		<view class="pay-card">
			<view class="pay-card-money">{{moneySymbol}}{{ orderDetail.orderMoney }}</view>
			<view class="item"><text class="tit">订单编号：</text>{{ orderDetail.orderSerialNumber }}</view>
			<view class="item"><text class="tit">下单时间：</text>{{ dayformat(orderDetail.createTime)}}</view>	
			<view class="item"><text class="tit">订单状态：</text>尚未发货</view>
		</view>
		<view class="btn-group">
			<button class="confirm-btn" @tap="navTo" :class="'bg-' + themeColor.name">查看订单</button>
			<button class="confirm-btn" @tap="toHome">返回首页</button>
		</view>
	</view>
</template>
<script>
	import {
		orderDetail
	} from '@/api/userInfo';
	import moment from '@/common/moment';
	import mConstDataConfig from '@/config/constData.config';
	export default {
		data() {
			return {
				loading: false,
				type: '',
				id: '',
				orderId: '',
				moneyBg: this.$mAssetsPath.moneyBg,
				moneySymbol: this.moneySymbol,
				orderDetail: {}
			};
		},
		onLoad(options) {
			const successThree = JSON.parse(decodeURIComponent(options.to));
			console.log(successThree)
			this.orderDetail=successThree
			this.befereInfo()
		},
		methods:{
			dayformat(value) {
							// var time = new Date().getTime();
							// var newtime = new Date(time);
							// var year = newtime.getFullYear();
							// var mon = newtime.getMonth();
							// var day = newtime.getDay();
							// var hour = newtime.getHours()
							// var minu = newtime.getMinutes()
							// var sec = newtime.getSeconds()
							// var t = year + ":" + mon + ":" + day + ":" + hour + ":" + minu + ":" + sec
							// return t;
							//时间戳为10位需*1000，时间戳为13位的话不需乘1000
							var date = new Date(value);
							// var date = new Date(value*1000);
							var year = date.getFullYear();
							var month = ("0" + (date.getMonth() + 1)).slice(-2);
							var sdate = ("0" + date.getDate()).slice(-2);
							var hour = ("0" + date.getHours()).slice(-2);
							var minute = ("0" + date.getMinutes()).slice(-2);
							var second = ("0" + date.getSeconds()).slice(-2);
							// 拼接
							var result = year + "年" + month + "月" + sdate + "日 " + hour + ":" + minute //+ ":" + second;
							// 返回
							return result;
			
						},
		}
	};
</script>
<style lang="scss">
	page {
		background-color: $page-color-base;
	}

	.pay-success {
		.pay-section {
			height: 400upx;
			overflow: hidden;
			display: flex;
			align-items: center;
			justify-content: center;

			.bg {
				position: absolute;
				left: 0;
				top: 0;
				width: 100vw;
				height: 60vw;
			}

			.tips-wrapper {
				display: flex;
				align-items: center;
				justify-content: center;
				color: $color-white;

				.iconfont {
					font-size: 132upx;
					margin-right: $spacing-base;
				}

				.content {
					.title {
						font-size: $font-lg + 4upx;
					}

					.tip {
						font-size: $font-sm + 2upx;
					}
				}
			}
		}

		.pay-card {
			width: 90%;
			height: 520upx;
			background-color: $color-white;
			border-radius: 12upx;
			margin: -80upx 5% 0;
			box-shadow: 0upx 5upx 25upx rgba(0, 0, 0, 0.05);

			.pay-card-money {
				text-align: center;
				font-size: $font-lg + 12upx;
				padding: $spacing-base 0;
				color: $color-black;
				font-weight: 500;
				border-bottom: 1upx solid rgba(0, 0, 0, 0.05);
			}

			.item {
				height: 80upx;
				line-height: 80upx;
				margin-left: $spacing-lg;
				color: $font-color-dark;

				.tit {
					color: $font-color-light;
				}
			}
		}

		.btn-group {
			padding-top: 60upx;

			.confirm-btn {
				margin-top: $spacing-lg;
				width: 72%;
			}
		}
	}
</style>
